@charset "UTF-8";

/* 计算rem */
@function r($px){
    @return ($px/40) * 1rem;
}
/* 减半px */
@function half($px){
    @return ($px/2) * 1px;
}

html,body{
    height: 100%;
    position: relative;
}

/* 搜索体 */
.search{
    position: absolute;
    width: r(750);
    top: half(123);
    text-align: center;
    >h5{
        width: 100%;
        font-size: 13px;
        margin-top: half(33);
    }
    .searchValue1,.searchValue2{
        width: r(512);
        text-align: center;
        margin: half(5) auto;
        box-sizing: border-box;
        .sV{
            width: 24.25%;
            height: r(64);
            background-color: #dcdcdc;
            margin-right: 1%;
            >a{
                font-size: 10px;
                color: #898989;
            }
        }
        .sV:last-of-type{
            margin-right: 0;
        }
    }
    .searchValue2{
        padding-top: 0;
    }
}

/* 主体 */
.main{
    position: absolute;
    width: r(750);
    top: half(435);
    bottom: half(135);
    overflow: scroll;
    -webkit-overflow-scrolling: touch;
    /* 热门搜索 */
    .hot{
        width: r(750);
        margin-top: 10px;
        .h_tip{
            width: 100%;
            box-sizing: border-box;
            padding: 0 half(21) 0 half(25);
            .tip{
                >img{
                    width: half(32);
                    height: half(47);
                    vertical-align: middle;
                }
                >span{
                    font-size: 15px;
                    vertical-align: middle;
                }
            }
            .Fmore{
                span{
                    font-size: 12px;
                    color: #000000;
                    vertical-align: middle;
                }
                img{
                    width: half(25);
                    height: half(26);
                    vertical-align: middle;
                }
            }
        }
        .h_pic{
            width: r(709);
            margin: half(37) auto;
            .picLt{
                width: 40%;
                img{
                    width: r(280);
                }
            }
            .picRt{
                width: 60%;
                box-sizing: border-box;
                padding-left: 5px;
                .topR{
                    width: 100%;
                    margin-bottom: -2px;
                    img{
                        width: r(420);
                    }
                }
                .botR{
                    width: 100%;
                    .bR{
                        width: 50%;
                        img:nth-of-type(1){
                            width: r(195);
                            height: r(197);
                            display: inline-block;
                            margin-right: half(9);
                        }
                        img:nth-of-type(2){
                            width: r(211);
                            height: r(197);
                        }
                    }
                }
            }
        }
    }
    /* 推荐搜索 */ 
    .advice{
        width: r(750);
        margin-top: 10px;
        .ad_tip{
            width: 100%;
            box-sizing: border-box;
            padding: 0 half(21) 0 half(25);
            .tip{
                >img{
                    width: half(41);
                    height: half(40);
                    vertical-align: middle;
                }
                >span{
                    font-size: 15px;
                    vertical-align: middle;
                }
            }
            .Fmore{
                span{
                    font-size: 12px;
                    color: #000000;
                    vertical-align: middle;
                }
                img{
                    width: half(25);
                    height: half(26);
                    vertical-align: middle;
                }
            }
        }
        .ad_pic{
            width: r(709);
            margin: half(37) auto;
            .ap{
                width: 25%;
                box-sizing: border-box;
                padding-left: 5px;
                img{
                   width: 100%;
                }
            }
        }
    }    
}